<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>异步场景对比</title>
</head>
<body>

</body>
<script src="js/jquery-1.8.1.js"></script>
<script>
   /* function myAjax(url) {
        $.ajax({
            url,
            success:(data)=>{
                console.log("myAjax--data-->",data)
            }
        })
    }*/


    {
        /*$.ajax({   //回调地狱
            url: "./data/aaa.txt",
            success: function () {
                $.ajax({
                    url: "./data/bbb.txt",
                    success: function () {
                        $.ajax({
                            url: "./data/ccc.txt",
                            success: function (data) {
                                console.log("ccc",data)
                            }
                        })
                    }
                })
            }
        })*/
    }
    {
        /*let p1 = new Promise((resolve, reject) => {
            resolve(myAjax("./data/aaa.txt"));
        });
        let p2 = new Promise((resolve, reject) => {
            resolve(myAjax("./data/bbb.txt"));
        });
        let p3 = new Promise((resolve, reject) => {
            resolve(myAjax("./data/ccc.txt"));
        });

        let pAll = Promise.all([p1,p2,p3]);
        pAll.then(
            success=>{
                console.log(success);
            },
            err=>{
                console.log("err===>",err);
            }
        )*/
    }
    {
       /* function myAjax(url) {
            $.ajax({
                url,
                success: (data) => {
                    console.log("myAjax--data-->", data);
                    myData.next();
                }
            })
        }

        function * getData() {
            yield myAjax("./data/aaa.txt");
            yield myAjax("./data/bbb.txt");
            yield myAjax("./data/ccc.txt");
        }

        var myData = getData();
        myData.next();*/
    }
    //[0,1,1,2,3,5,8]

   {
       /*function * fibonacci(seed1, seed2) {
           while (true) {
               yield (() => {
                   seed2 = seed2 + seed1;
                   seed1 = seed2 - seed1;
                   return seed2;
               })();
           }
       }*/
   }

   //对比: ajax Promise 和 Generator
   //场景:
   // 用户登录===>登陆成功  普通用户 ==> 普通用户信息
   //                    管理员  ==> 所有用户信息

   {//ajax方式
       /*$.ajax({
           url: "./data/aaa.txt",
           success: function (data) {
               if(data === "manager"){
                   $.ajax({
                       url: "./data/bbb.txt",
                       success: function (managerMsg) {
                           console.log("managerMsg",managerMsg)
                       }
                   })
               }else {
                   $.ajax({
                       url: "./data/ccc.txt",
                       success: function (msg) {
                           console.log("msg",msg)
                       }
                   })
               }
           }
       })*/
   }
   {//Promise方式
       /*Promise.resolve(
           $.ajax({
               url: "./data/aaa.txt"
           })
       ).then(
           success=>{
               console.log("Promise--success",success);
               if(success === "manager"){
                   Promise.resolve(
                       $.ajax({
                           url: "./data/bbb.txt"
                       })
                   ).then(
                       success=>{
                           console.log("BBB.txt数据",success)
                       }
                   )
               }else {
                   Promise.resolve(
                       $.ajax({
                           url: "./data/ccc.txt"
                       })
                   ).then(
                       success=>{
                           console.log("CCC.txt数据",success)
                       }
                   )
               }
           }
       )*/
   }
   {//Generator方式
       // 用户登录===>登陆成功  普通用户 ==> 普通用户信息
       //                    管理员  ==> 所有用户信息
       /*function myAjax(url) {
           $.ajax({
               url: url,
               success: function (data) {
                   console.log("myAjax数据",data);
                   it.next(data);
               }
           })
       }

       function * getData() {
           let userType = yield myAjax("./data/aaa.txt");
           if(userType === "manager"){
               let managerInfo = yield myAjax("./data/bbb.txt");
               console.log("managerInfo==>", managerInfo)
           }else {
               let userInfo = yield myAjax("./data/ccc.txt");
               console.log("userInfo==>", userInfo)
           }
       }
       var it = getData();
       it.next();*/
   }
   {//async方式
       async function getData() {
           let userType = await Promise.resolve($.ajax("./data/aaa.txt"));
           if(userType === "manager"){
               let managerInfo = await Promise.resolve($.ajax("./data/bbb.txt"));
               console.log("managerInfo==>", managerInfo)
           }else {
               let userInfo = await Promise.resolve($.ajax("./data/ccc.txt"));
               console.log("managerInfo==>", userInfo)
           }
       }
       getData();
   }

// ES5 ajax--> ES6 promise --> ES6 Generator ---> ES7 async await 终极异步解决方案
    //XMLHTTPRequest--> ajax -> Promise -> axios












</script>
</html>